{%include "topo_180plus.html"%}
	<div id="principal">
		<div id="meio">
			<div id="conteudo">
				{%include "header.html"%}
				<div class="box_final box_publicado">
					<p style="font: 20px arial;"><strong style="color:#f57f1c">Parabens!</strong> O seu anuncio foi publicado com sucesso.</p>	
					<p style="font: 14px arial;">Voce pode gerenciar o seu anuncio acessando o seu perfil</p>	
					<p style="font: 14px arial;">Seu anuncio pode ser visualizado aqui: <a href="/anuncio/{{anuncioThumb.id}}" target="_blank" style="color:blue">Link do meu anuncio</a></p>	
					<p style="font: 14px arial;">O seu anuncio aparecera nos resultados de busca em alguns instantes.</p>	
				</div>
				<div class="box_final box_destacar">
					<div class="chamada_destaque">
						<img src="{{MEDIA_URL}}/imagens/destaque-maior.png"/>
						<p class="titulo_destaque"><strong style="font: 25px arial;color:#f57f1c;">Destaque o seu anuncio!</strong></p>	
						<p class="descricao_destaque">De destaque ao seu anuncio e aumente a visibilidade do seu anuncio. <a onClick="openbox('', 1)" href="#">Saiba mais.</a></p>	
					</div>
					<div class="box_opcao">
					<form action="/destacar/{{anuncioThumb.id}}/" method="post">
						{%csrf_token%}
						<h4>Opcoes de destaque para seu anuncio</h4>
						{%for pacote in pacotes%}
						{%if forloop.counter in list%}
						<div class="pacotes">
							<div class="pacote-resumo">
								<input type="checkbox" name="check_opc{{pacote.id}}" />
								<p><strong>Pacote {{pacote.id}}:</strong>  {{pacote.descricao}}.</p>
								<p class="valor"><strong>R$ {{pacote.preco}}/semana</strong></p>
							</div>
							<div class="opcs_blog">
								<select id="opcaoBlog{{pacote.id}}" class="opc_blog">
									{%for blog in blogs%}
									<option value="{{blog.id}}">{{blog.titulo}}</option>
									{%endfor%}
								</select>
								<select id="opcaoTempo{{pacote.id}}" name="semana{{pacote.id}}" class="opc_tempo">
									<option value="1" selected>1 semana</option>
									<option value="2">2 semanas</option>
									<option value="3">3 semanas</option>
									<option value="4">4 semanas</option>
									<option value="5">5 semanas</option>
								</select>
							</div>
							<button type="button" id = "addEscolha{{pacote.id}}" class="add_escolha">+</button>												
							<ul id="previewEscolha{{pacote.id}}" class="escolhas_blog">
							<script type="text/javascript">
							   var cont = [1,1];
							$("#addEscolha{{pacote.id}}").click(function(){
								var blo = document.getElementById("opcaoBlog{{pacote.id}}").value;
								var sem = document.getElementById("opcaoTempo{{pacote.id}}").value;

								var novoItem = $("<li>Blog: <span>" + blo + "</span> Duracao: <span>" + sem + " semanas</span><button id=\"button{{pacote.id}}\">X</button><input type=\"hidden\" name=\"blogInterno{{pacote.id}}"+cont[{{pacote.id}}-3]+"\" value=\"" + blo + "\"/><input type=\"hidden\" name=\"semanaInterno{{pacote.id}}"+cont[{{pacote.id}}-3]+"\" value=\"" + sem + "\"/></li>");
								var quantidade = $("<input type=\"hidden\" name=\"quantidade{{pacote.id}}\" value=\"" + cont[{{pacote.id}}-3] + "\"/>");
								cont[{{pacote.id}}-3] = cont[{{pacote.id}}-3] + 1;
								novoItem.find("#button{{pacote.id}}").click(function () {
									$(this).parent().remove();
								});
								$("#previewEscolha{{pacote.id}}").append(novoItem);
								$("#previewEscolha{{pacote.id}}").remove(quantidade);
								$("#previewEscolha{{pacote.id}}").append(quantidade);
							});
							</script>
							</ul>
						</div>
						{%else%}
						<div class="pacotes">
							<input type="checkbox" name="check_opc{{pacote.id}}" />
							<p><strong>Pacote {{pacote.id}}:</strong> {{pacote.descricao}}.</p>
							<p class="valor"><strong>R$ {{pacote.preco}}/semana</strong></p>
							<select name="semana{{pacote.id}}">
								<option value="1" selected>1 semana</option>
								<option value="2">2 semanas</option>
								<option value="3">3 semanas</option>
								<option value="4">4 semanas</option>
								<option value="5">5 semanas</option>
							</select>												
						</div>
						{%endif%}
						{%endfor%}
						
						<input type="button" id="btn_destacar" onclick="showDiv('escolhas','btn_destacar')" value="Destacar Anuncio" />
						<a href="/anuncio/{{anuncioThumb.id}}"> <button type="button" value="Sem Destaque">Sem Destaque</button></a>
						<div id="escolhas" class="pacotes">
							<!-- h4>Confirmacao de escolhas:</h4>
							<p>Voce esta contratando os servicos: <strong>(<em>Pacote 1</em> - por 2 semanas)</strong> + <strong>(<em>Pacote 2</em> - por 1 semana)</strong> + <strong>(<em>Pacote 3</em> - por 4 semanas)</strong></p>
							<p><strong>Total de: <em>R$ 115,00</em></strong></p-->
							<input type="submit" value="Confirmar"/>
						</div>
					</form>
					</div>
					<div class="box_exemplos">
						<div class="exemplos" style="position: relative; float: top; min-height: 70px;">
							<h4 style="margin: 0;padding: 20px 0 5px 0;">Pre-visualizacao</h4>
							<a class="ex-opcs exemplo_escolhido" name="exemplo1">Pacote 1</a><a class="ex-opcs" name="exemplo2">Pacote 2</a><a class="ex-opcs" name="exemplo3">Pacote 3</a><a class="ex-opcs" name="exemplo4">Pacote 4</a><a class="ex-opcs" name="exemplo5">Pacote 5</a><a class="ex-opcs last" name="exemplo6">Pacote 6</a>
						</div>
						<div id="exemplo1" class="pacote_exemplo">
							<img src="{{MEDIA_URL}}/imagens/pacote1_opc2.png">
						</div>										
						<div id="exemplo2" class="pacote_exemplo">
							<img src="{{MEDIA_URL}}/imagens/pacote2_opc2.png">
						</div>										
						<div id="exemplo3" class="pacote_exemplo">
							<img src="{{MEDIA_URL}}/imagens/pacote1_opc2.png">
						</div>										
						<div id="exemplo4" class="pacote_exemplo">
							<img src="{{MEDIA_URL}}/imagens/pacote2_opc2.png">
						</div>										
						<div id="exemplo5" class="pacote_exemplo">
							<img src="{{MEDIA_URL}}/imagens/pacote6_opc2.png">
						</div>										
						<div id="exemplo6" class="pacote_exemplo">
							<img src="{{MEDIA_URL}}/imagens/pacote5_opc2.png">
						</div>										
					</div>
				</div>
			</div>
		</div>	
		<div id="publicidade">
			<div class="publicidade_link">
				<a href="#" title="Publicidade 3" ><img src="{{MEDIA_URL}}imagens/pub4.png">Publicidade 3</a> 
			</div>
		</div>
	</div>
	{%include "rodape_regioes.html"%}
</body>
</html>